@import "../common/functions.scss";
$fs: pxToRem(28px) pxToRem(24px) pxToRem(30px);
%fb{font-weight: bold;}
$cfff: #ffffff;
$red:#B22222;
$bgc:#EEEEEE;
$ccc:#CCCCCC;

body{
	background: $bgc;
}
.integral{
  padding: 0 pxToRem(30px);
  height: pxToRem(80px);
  line-height: pxToRem(80px);
  background: $cfff;
  border-top: 1px solid #c8c8cc;
  border-bottom: 1px solid #c8c8cc;
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between; 
	.name{
	  font-size: pxToRem(30px);
	}
	.jifen{
	  font-size: pxToRem(24px);
	  margin-left: pxToRem(180px);
	  	ins{
	  	  font-size: pxToRem(34px);
	  	  color: #e51d23;
	      font-weight: bolder; 	
	  	}
	}
	.order{
	  width: pxToRem(164px);
	  height: pxToRem(50px);
	  line-height: pxToRem(50px);
	  color: $cfff;
	  text-align: center;
	  font-size: pxToRem(24px);
	  background: #b22222;
	  display: inline-block;
	  border-radius: pxToRem(10px);
	  margin-top: pxToRem(15px);       
	} 	
}
.scroll-wrap{  
  margin-top: pxToRem(20px); 
  border-top: 1px solid #c8c8cc;
  border-bottom: 1px solid #c8c8cc;   	
}
.scroll-wrap img,.swiper-wrapper img{
  width: 100%;
  height: auto;	
}
.swiper-slide{
   width: 100%!important; 
}
.goodport {
    position: relative;
    // width: pxToRem(750px);
    overflow: hidden;
}
.sort{
  width: 100%;
  height: pxToRem(98px);
  line-height: pxToRem(98px);
  display: -webkit-box;
  color: #333;
  text-align: center;
  font-size: pxToRem(30px);
  border-bottom: 1px solid #c8c8cc;
  background: $cfff;
	.item{
   	   -webkit-box-flex: 1.0;
       box-flex: 1.0;
       cursor: pointer;
	}
	.active{
   	   color: #b22222;
   	   border-bottom:4px solid #b22222; 
	}
  a{color: #333333;}
}
.module-con{
	.component{
   	   display: block;
       color: #333;
       font-size: pxToRem(24px);
       line-height: pxToRem(84px);
       height: pxToRem(84px);
       text-align: center;
        .c-line {
		   display: inline-block;
		   border-bottom: 2px solid #b22222;
		   width: pxToRem(50px);
		   margin-bottom: pxToRem(5px);
        }
        .left{
		   margin-right: pxToRem(17px); 
        }
        .right{
		   margin-left: pxToRem(17px); 
        }
	}
	.m-info{
   	   border-top: 1px solid #c8c8cc;
   	   border-bottom: 1px solid #c8c8cc;
   	   img{
   	   	width: 100%;
   	   	height: auto;
   	   } 	
	}	
}
.goodport .swiper-pagination-bullet.swiper-pagination-bullet-active {
    opacity: 1;
    background: #b22222;
}
.swiper-pagination .swiper-pagination-bullet {
    width: pxToRem(12px);
    height: pxToRem(12px);
    display: inline-block;
    border-radius: 100%;
    background: #fff;
    opacity: 1;
}
.goodport.swiper-container-horizontal>.swiper-pagination-fraction {
    bottom: -5px;
    left: 0;
    width: 100%;
}